<div
  class="mdl-grid mdl-cell mdl-cell--9-col-desktop mdl-cell--12-col-tablet mdl-cell--4-col-phone mdl-cell--top">
  <div class="mdl-cell mdl-cell--4-col-desktop mdl-cell--4-col-tablet mdl-cell--2-col-phone">
    <base-card>
      <base-card-title>
        <h2 class="mdl-card__title-text">My Day</h2>
      </base-card-title>
      <base-card-body>
        <app-pie-chart></app-pie-chart>
      </base-card-body>
    </base-card>
  </div>
  <div class="mdl-cell mdl-cell--4-col-desktop mdl-cell--4-col-tablet mdl-cell--2-col-phone">
    <app-weather></app-weather>
  </div>
  <div class="mdl-cell mdl-cell--4-col-desktop mdl-cell--4-col-tablet mdl-cell--2-col-phone">
    <app-trending></app-trending>
  </div>
  <div class="mdl-cell mdl-cell--5-col-desktop mdl-cell--5-col-tablet mdl-cell--2-col-phone">
    <app-cotoneaster-card></app-cotoneaster-card>
  </div>
  <div class="mdl-cell mdl-cell--7-col-desktop mdl-cell--7-col-tablet mdl-cell--4-col-phone">
    <base-card>
      <base-card-title>
        <h2 class="mdl-card__title-text">Startup Financing Cycle</h2>
      </base-card-title>
      <base-card-body>
        <app-line-chart></app-line-chart>
      </base-card-body>
    </base-card>
  </div>
  <div class="mdl-cell mdl-cell--12-col-desktop mdl-cell--12-col-tablet mdl-cell--4-col-phone ">
    <app-table-card></app-table-card>
  </div>
</div>
<div
  class="mdl-grid mdl-cell mdl-cell--3-col-desktop mdl-cell--12-col-tablet mdl-cell--4-col-phone mdl-cell--top">
  <div class="mdl-cell mdl-cell--12-col-desktop mdl-cell--6-col-tablet mdl-cell--2-col-phone">
    <app-robot-card></app-robot-card>
  </div>
  <div class="mdl-cell mdl-cell--12-col-desktop mdl-cell--6-col-tablet mdl-cell--2-col-phone">
    <app-todo-list></app-todo-list>
  </div>
</div>
